<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Your Lyrics</title>
	<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
	<script type="text/javascript" src="js/jquery.js"></script>
	<script type="text/javascript" src="js/bootstrap.min.js"></script>
	<script type="text/javascript" src="js/tagcloud.js"></script>
	<style type="text/css">
		a:link {color: #fff}		/* 未访问的链接 */
		a:visited {color: #fff}	/* 已访问的链接 */
		a:hover {color: #000}	/* 鼠标移动到链接上 */
		a:active {color: #fff}	/* 选定的链接 */
		.shou{
			font-size: 20px;
		}
		#tagsList {
			position:relative;
			width:100%; 
			height:800px; 
			margin: -50px auto; 
			background:#24313d;
		}
		#tagsList a {
			position:absolute; 
			top:0px; 
			left:0px; 
			font-family: Microsoft YaHei; 
			color:#fff; 
			font-weight:bold; 
			text-decoration:none; 
			padding: 3px 50px;
			font-size: 50px; 
		}
		#tagsList a:hover { 
			color:#FF0000; 
			letter-spacing:3px;
		}


	</style>
</head>
<body >

	<!-- -------------------- 导航条 ---------------------------- -->
	<header >
		<nav class="navbar navbar-fixed-top " style="background:black;">
	      <div class="container">
	        <div class="navbar-header">
	          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
	            <span class="sr-only">Toggle navigation</span>
	            <span class="icon-bar"></span>
	            <span class="icon-bar"></span>
	            <span class="icon-bar"></span>
				
	          </button>
	          <a class="navbar-brand desktop" href="index.html">
            	<img src="img/icon.png" alert="icon" width="30px" height="30px">
         	  </a>
	        </div>
	        <div id="navbar" class="navbar-collapse collapse">
	          
	          <div >
	          	<ul  class="nav navbar-nav navbar-right pull-left">
	          		<li ><a class="shou" href="index.html">首页</a></li>
					<li ><a class="shou" href="share.html">歌词分享</a></li>
					<li ><a class="shou" href="music.html">音乐欣赏</a></li>
					<li ><a class="shou" href="http://zzesxiao.leanote.com">关于我们</a></li>
				</ul>

			</div>                    
			<div >
	            <ul class="nav navbar-nav navbar-right pull-right">
	              <li><a class="shou" href="http://zzesxiao.leanote.com" class="sign-up-link">注册</a></li>
	              <li><a class="shou" href="http://zzesxiao.leanote.com">登录</a></li>
	              </li>
	            </ul>
	          </div>
	        </div><!--/.nav-collapse -->
	      </div>
	    </nav>
	</header>
	<!-- -------------------- 导航条 END ---------------------------- -->

	
	<!-- -----------------------------标签云------------------------- -->
	<div id="tagsList">
			<span><a href="">我能有多骄傲，不堪一击好不好，一碰到你我就被撂倒</a></span>
	        <span><a href="">我来到你的城市，走过你来时的路</a></span>
	        <span><a href="">我们曾相爱，想到就心酸</a></span>
	        <span><a href="">我拥有的都是侥幸啊，我失去的都是人生</a></span>
	        <span><a href="">I am you，You are me，We are one</a></span>
			<span><a href="">见尽了云涌风起，还怎么舍得放下你</a></span>
			<span><a href="">你要静候，再静候，就算失收，始终要守</a></span>
			<span><a href="">得不到的永远在骚动，被偏爱的总是有恃无恐</a></span>
			<span><a href="">原来过得很快乐,只我一人未发觉,如能忘掉渴望,岁月长,衣裳薄</a></span>
			<span><a href="">我就是我，是颜色不一样的烟火。天空海阔，要做最坚强的泡沫</a></span>
			<span><a href="">冷漠的人，谢谢你们曾经看轻我，让我不低头更精彩的活。</a></span>
			<span><a href="">让风吹干流过的泪和汗，总有一天我有属于我的天。</a></span>
			<span><a href="">把握生命里的每一分钟，全力以赴我们心中的梦，不经历风雨 怎么见彩虹，没有人能随便便成功。</a></span>
			<span><a href="">随风奔跑自由是方向，追逐雷和闪电的力量，把浩瀚的海洋装进我胸膛，即使再小的帆也能远航。随风飞翔有梦做翅膀，敢爱敢做勇敢闯一闯，哪怕遇见再大的风险，再大的浪，也会有默契的目光。</a></span>
			<span><a href="">生平第一次我放下矜持，相信自己真的可以深深去爱你。</a></span>
			<span><a href="">还是好朋友，比爱人长久，不能牵的手按在心头。</a></span>
			<span><a href="">喜欢你，那双眼动人，笑声更迷人。愿再可，轻抚你，那可爱面容。挽手说梦话，像昨天，你共我。</a></span>
			<span><a href="">但我的心每分每刻，仍然被她占有。</a></span>
	
	</div>
	

	<!-- ------------------------页尾 ---------------------------- -->
	<div class="col-md-12" >
		<hr style="background-color:#161515;height:10px;">
		<center>
			<p>版权所有 &copy; 治中电科</p>
			<p>友情链接：
				<a style="color:black;" href="http://musicase.me/">musiccase</a>
				<a style="color:black;" href="http://music.163.com/">网易云音乐</a>
				<a style="color:black;" href="http://zzesxiao.leanote.com">治电小白菜博客</a>
				<a style="color:black;" href="http://klren0312-zzes5.daoapp.io/">治中电科</a>
			</p>
			
		</center>
	</div>
	<!-- ------------------------页尾 END ---------------------------- -->

	<script type="text/javascript">
		$(function(){
			// 图片和字交换位置的动画
			$('#ge').mousemove(function(){
				$('#img1').animate({left:"680px"});
				$('#font1').animate({right:"660px"});
			})
			


			//文字隐藏		
			$('#font2').hide();
			//图片透明度降低，文字显示
			$('#ren').mouseover(function(){
				$('#img2').animate({opacity:"0.5"});
				$('#font2').show(2000);
			});

		})
	</script>
</body>
</html>